<%@ page language="java" pageEncoding="utf-8" %>

<html>

<head>
    <title>自行车停车场管理</title>
</head>
<body style="overflow: hidden;">
<nav class="breadcrumb"><i class="Hui-iconfont">&#xe67f;</i> 首页 <span class="c-gray en">&gt;</span>
    场库管理 <span class="c-gray en">&gt;</span>
    自行车停车信息列表
</nav>
<div class="container">
    <div id="right" style='float:right;width:80%;height:99%;border-left:2px ridge;overflow: hidden'>

        <div class="righthead">
            <div style="height:9px"></div>
            <div id="showBtn" class="hideLeft"></div>
            <div class="hideLeftT">
                <div id="refresh" class="hideLeftTwo"></div>
                <div id="text" class="refreshtext"><span>刷新</span></div>
            </div>
        </div>
        <div id="mapObj" style="width:99%;height:99%">
        </div>

    </div>
    <div id="left" style='width:20%;height:99%;'>
        <div id="param" class="lefthead">
            &nbsp;
            <input type="text" placeholder=" 停车场名称" style="width:150px;height:27px;padding-left:5px;margin-top: 5px"
                   class="input-text"
                   id="name">&nbsp;
            <input class="btn btn-primary size-S radius" style="margin-top: 5px" type="button" id="doSearch" value="搜索">

            <div style=" margin-left: 10px;margin-top: 4px;">
                <input type="radio" name="radio" value="netname"
                       id="netname" checked="checked">
                <label for="netname">名称</label>

                <input type="radio" name="radio" value="nettype" id="nettype">
                <label for="nettype">地址</label>
                &nbsp;
                <label for="totalparknum">车位数>=</label>
                <input type="text" name="number" id="totalparknum" pattern="^[1-9]\d*$" style="width: 30px;height: 20px"
                       value="0">
                <%-- <input type="text" name="number" id="totalparknum" style="width: 30px;height: 20px"
                        value="0"  onkeyup="if(this.value.length==1){this.value=this.value.replace(/[^1-9]/g,'')}else{this.value=this.value.replace(/\D/g,'')}"
                        onafterpaste="if(this.value.length==1){this.value=this.value.replace(/[^1-9]/g,'')}else{this.value=this.value.replace(/\D/g,'')}">--%>
            </div>
        </div>
        <div id="result" class="parkinfos"></div>
        <div id="resulttotal" style="font-size: 12px;color: #999;height: 42px;line-height: 42px;">系统为您找到相关结果${total}个
        </div>
        <div id="pagination" style="text-align:center;margin-top:5px"><!-- 这里显示分页 --></div>
    </div>
</div>


</body>
</html>
<%@include file="../../head-ui.jsp" %>
<script type="text/javascript" src="<%=request.getContextPath()%>/resources/js/public/mapObj.js"></script>
<script type="text/javascript">
    var mapObj = null;
    var index;
    var arrbiketitle = [];
    var arrlinkmap = [];
    $(function () {
        var total = parseInt('${total}');

        mapObj = new MapEditor("mapObj", null)
        pageselectCallback();
        $("#doSearch").click(function () {
            if (pattern($('#totalparknum').val())) {
                $.ajax({
                    url: '<%=request.getContextPath()%>/back/bike/getCount.do',
                    type: 'POST',
                    data: "netname=" + ($("#name").val() || "") +
                    "&columnname=" + pd()["radio"] + "&numcondition=" + (pd()["totalparknum"] || ""),
                    success: function (count) {
                        $("#resulttotal").empty().append("系统为您找到相关结果" + count + "个")
                        pageselectCallback();
                    }
                })
            } else {
                searchErrorDialog();
            }
        })

        $('#text').click(function () {

            if (pattern($('#totalparknum').val())) {
                mapObj.removeAll();
                pageselectCallback();
            } else {
                RefresErrorDialog();
            }

        });

        $("#showBtn").click(function () {
            var btn = $("#showBtn");
            var right = $("#right");
            $("#left").toggle();
            if (btn.hasClass("hideLeft")) {
                btn.removeClass("hideLeft").addClass("showLeft");

                right.width($(".container").width());
                right.addClass("fullScreen");
            } else {
                btn.removeClass("showLeft").addClass("hideLeft");
                right.width($(".container").width() * 0.8);
                right.removeClass("fullScreen");
            }


        })
    });

    function pageselectCallback() {
        var arr = [];
        $("#result").empty().append("正在加载数据,请稍等.....");
        $.ajax({
            url: '<%=request.getContextPath()%>/back/bike/list.do',
            type: 'POST',

            data: "netname=" + ($("#name").val() || "") +
            "&columnname=" + pd()["radio"] + "&numcondition=" + (pd()["totalparknum"] || ""),
            success: function (json) {
                var html = "";
                for (var i = 0; i < json.data.length; i++) {
                    var obj = json.data[i];
                    if (i == json.data.length) {

                        var str = "&nbsp;&nbsp;<li id='" + obj.unid + "'style='list-style-type: none; margin-left:3px; margin-top:-17px; cursor: pointer; ' " +
                                "onmouseover=\"onmouseover_Style(" + obj.unid + ")\" onmouseout=\"onmouseout_Style(" + obj.unid + ")\"" +
                                "onclick='bikelinkMap(" + obj.unid + ")'>" + (i + 1) + "、" + obj.netname + "<a onclick=\"editBikelink(" + obj.unid + ") class='xq'>详情>>" + "<a/>" + "</li>";
                    } else {
                        var str = "&nbsp;&nbsp;<li id='" + obj.unid + "' style='list-style-type: none;margin-left:3px;margin-top:-17px;" +
                                "border-bottom-width: 1px; border-bottom-style: dashed; border-bottom-color: rgb(219, 219, 219); cursor: pointer; ' " +
                                "onmouseover=\"onmouseover_Style(" + obj.unid + ")\" onmouseout=\"onmouseout_Style(" + obj.unid + ")\" " +
                                "onclick='bikelinkMap(" + obj.unid + ")'>" + (i + 1) + "、" + obj.netname + "<a onclick=\"editBikelink(" + obj.unid + ")\" class='xq'>详情>>" + "</a>" + "</li>";
                    }
                    html += str;
                    arr.push(mapObj.addMarker(linkmapcontent(obj)));
                    arrlinkmap = arr;
                }
                //   mapObj.map.setViewport(arr);
                $("#result").empty().append(html);
            }
        })
        if (arr.length != null) {
            mapObj.removeAll();
            arr = [];
            arrbiketitle = [];
        }
        return false;
    }

    function linkmapcontent(obj) {
        obj.label = obj.bicyclecapacity;
        var title = "<strong class='titlefont'>" + obj.netname + "</strong>" + "<a onclick=\"editBikelink('" +

                obj.unid + "')\" href='#' class='xq'>详情>>" + "</a>" + "" + "<hr class='ys'> </>" // 信息窗口标
        obj.imagename = "park";//标识
        obj.content = "<div class='titlefont'> <strong>开放时间：</strong>" + obj.opendate +
                "<div><strong>区域：</strong>" + obj.runleveldistrict + "</div>" +
                "<div><strong>地址：</strong>" + obj.netname + "</div>" +
                "<div><strong>停车场容量(个)：</strong>" + obj.bicyclecapacity + "</div>" +
                "<div><strong>当前停车数(个)：</strong>" + obj.bicyclenum + "</div>" +
                "</div>";
        obj.title = mapObj.getwindow(280, 170, title);
        arrbiketitle.push(obj.title);
        return obj;
    }

    function bikelinkMap(id) {
        $("#result li").css("background", "");
        $("#" + id).css("background", "#EEEEEE");
        var bikewindowcentent = new Object();
        var centen = null;
        var titlecontent = null;
        for (var i = 0; i < arrlinkmap.length; i++) {
            if (arrlinkmap[i].unid == id) {
                centen = arrlinkmap[i];
                titlecontent = arrbiketitle[i];
            }
        }
        bikewindowcentent.point = new BMap.Point(centen.lng, centen.lat);
        bikewindowcentent.titlecontent = titlecontent;
        bikewindowcentent.content = "<div class='titlefont'> <strong>开放时间：</strong>" + centen.opendate +
                "<div><strong>区域：</strong>" + centen.runleveldistrict + "</div>" +
                "<div><strong>地址：</strong>" + centen.netname + "</div>" +
                "<div><strong>停车场容量(个)：</strong>" + centen.bicyclecapacity + "</div>" +
                "<div><strong>当前停车数(个)：</strong>" + centen.bicyclenum + "</div>" +
                "</div>";
        mapObj.linkMap(bikewindowcentent, centen.marker);
    }
    function editBikelink(unid) {

        var index = layer.open({
            type: 2,
            title: '自行车停车场编辑',
            content: "<%=request.getContextPath()%>/back/bike/edit.do?unid=" + unid
        });
        layer.full(index);
    }

    function pd() {
        var xzcondition = new Object();
        xzcondition["totalparknum"] = $('#totalparknum').val();
        if ($('#netname').is(':checked')) {
            xzcondition["radio"] = $("#netname").val();
        } else if ($('#nettype').is(':checked')) {
            xzcondition["radio"] = $("#nettype").val();
        }
        return xzcondition;

    }




</script>